<!DOCTYPE html>
<html>
<head>
	<title>test</title>
</head>
<body>
	<header style="padding: 5px;background: #000;
    color: #fff;">
		项目进度
	</header>

	<div style="display: none" class="point" open-button status="1" for="#list">收起列表<span class="status">-</span></div>
	<div id="list" class="list" style="border:1px solid #ececec;padding: 5px; position: relative; overflow-x: auto;
    white-space: nowrap;">
        <div>
		<span class="item end">需求分析</span>
        <span class="item end">功能设计</span>
        <span class="item end">项目环境搭建</span>
        <span class="item end">数据库设计</span>
        <span class="item on">功能接口开发</span>
        <span class="item">功能接口测试</span>

        </div>
        <div class="prbg"></div>
	</div>
    <div id="interface">
        <h3 style="color: #f00;">接口列表</h3>
        <div class="item">
            <b style="border-left: #f00 4px solid;
    padding-left: 2px;">登录</b>
            <div class="">
接口地址：http://op.juhe.cn/idcard/query <br>
返回格式：json <br>
请求方式：http get/post <br>
请求示例：http://op.juhe.cn/idcard/query?key=您申请的KEY&idcard=&realname= <br>
接口备注：error_code为0时计费 <br>
            </div>

            <div class="">
                <b>参数说明</b><br>
            </div>

            <div class="">
                <b>返回参数</b><br>
            </div>

            <div class="">
                <b>参数说明</b><br>
            </div>
        </div>



        <div class="item">
            <b style="border-left: #f00 4px solid;
    padding-left: 2px;">登录</b>
            <div class="">
接口地址：http://op.juhe.cn/idcard/query <br>
返回格式：json <br>
请求方式：http get/post <br>
请求示例：http://op.juhe.cn/idcard/query?key=您申请的KEY&idcard=&realname= <br>
接口备注：error_code为0时计费 <br>
            </div>

            <div class="">
                <b>参数说明</b><br>
            </div>

            <div class="">
                <b>返回参数</b><br>
            </div>

            <div class="">
                <b>参数说明</b><br>
            </div>
        </div>


    </div>



	<div class="point" open-button status="0" for="#footer">添加数据<span class="status">+</span></div>
	<footer id="footer" style="display: none">
	   
	</footer>
    <style type="text/css">
        body{
            font-family: "宋体";
        }
        span.item{
            border: #000 1px solid;
            background: #fff;
            margin: 0 8px;
            cursor: pointer;
            padding: 2px;
        }
        span.item.on{
            background: #f00;
            color: #fff;
        }
        span.item.end{
            background: #000;
            color: #fff;
        }
        div.item{
            margin: 20px 5px;
            border: 1px solid #eee;
            padding: 5px;
            line-height: 1.6;
        }
        .prbg{
            position: absolute;
            border: 1px solid #000;
            top: 49%;
            width: 100%;
            height: 2px;
            z-index: -1;
        }
    </style>

	<script src="/component/jquery.min.js"></script>
	<script type="text/javascript">
		//调试环境 chrome
	
	</script>
</body>
</html>